import React, { Component } from "react";  /* eslint-disable eqeqeq */
import PubSub from 'pubsub-js';
import { meshLog, SPRemove, SPGet, SPSet } from "../../config";
import "./home.less";
import Mqtt from './mqtt';
import MqttComponent from '../../utils/MqttComponent';
import mqtt from "mqtt";

import { getMqtt } from '../../api/index.js';

export default class Home extends Component {
  constructor(a) {
    super(a);
    this.state = {
      showDiaolg: 'hidden',
    }
  }
  componentWillUnmount() {


  }
  async componentDidMount() {
    meshLog('1111',);

    // 成功的mqtt开始
    let mqttpandun = 0//用来进行mqtt判断，如果一直是0，就说明mqtt没收到信息，这就要修改OK弹框
    //var mqtt = new Mqtt("13.56.227.196:3005");//里面写上ip和端口
    var mqtt = new Mqtt("swa.hglighting.net:3005");//里面写上ip和端口
    //var mqtt = new Mqtt("47.94.172.154:1883");//里面写上ip和端口
    var topic = "mqtt-camera-video";//这里就是主题
    mqtt.link().then((client) => {//封装成promsie方便使用
      //client这里保留了原生的client函数和用法
      var sendMess = { //这就是要传给后端的参数
        MessageId: topic,
        TopicId: topic,
        Time: new Date().getTime(),
        ClientID: mqtt.clientId,//这个mqtt是生成随机生成的随机数
        //当然要想申请新的随机数可以mqtt.random()
      };
      mqtt.subscribe(topic);//订阅主题
      // mqtt.subscribe(topic + "/" + mqtt.clientId);//订阅主题
      // mqtt.publish(topic, sendMess, { qos: 0 })//向某个主题发送消息
      mqtt.message(function (data, topic) {//接收消息，跟据返回的主题可以确定是哪个主题给的消息
        meshLog("mqtt回传之后的信息1111", JSON.parse(data));
        PubSub.publish('shuju', JSON.parse(data))

      });


    });
    //成功的mqtt

  }


  mqttsend1 = async () => {
    const date = {
      code: 'ble',
      date: 'FFFF20200C620000FFFFE4A507FAD30200C00202', //切dmx
      area: 'R1',
    }
    let result = await getMqtt(date)
    meshLog('result', result);
  }
  mqttsend2 = async () => {
    const date = {//切蓝牙
      code: 'ble',
      date: 'FFFF20200C620000FFFFE4A507FAD30201C00202',
      area: 'R1',

    }
    let result = await getMqtt(date)
    meshLog('result', result);
  }
  mqttsend3 = async () => {
    const date = {
      code: 'set_number',
      ble: 'FFFF20200C620000FFFFE4A507FAD30201C00202',
      dmx: '5A4E5A4D03000000',
    }
    let result = await getMqtt(date)
    meshLog('result', result);
  }
  mqttsend = async () => {
  }
  render() {
    return (
      <div className="neirong" >
        <div className="zuo" id="areaheight">
          <div style={{ width: 340, marginTop: 200 }}>
            <button onClick={() => { this.mqttsend1() }} >切换蓝牙</button>
            <button onClick={() => { this.mqttsend2() }} >切换dmx</button>
            <button onClick={() => { this.mqttsend3() }} >测试mqtt分组</button>
            {/* <MqttComponent /> */}
          </div>
        </div>
        <div className="zuida">
          <div className="you">
            <div style={{ textAlign: 'center', marginTop: 200 }}>
              <h1 onClick={() => { this.mqttsend() }}  >待开发</h1>
            </div>
          </div>
        </div>
      </div >
    )
  }
}
